<template>
             <div class="youhui" @click=tiaozou() >
              <div class="img">
                 <img src="../../img/优惠券左边@2x.png" alt="">
                 <div><span>￥ </span>{{data.qianshu}}</div>
           </div>
           <span class="box">
               <div class="neirong">
                   <div class="neirongone">{{data.neirongone}}</div>
                   <div class="neirongtwo">期限：{{data.neirongtwo}}</div>
               </div>
               <div class="img1" v-if="shiyong==true">
                 <img src="../../img/完成@2x.png" alt="">
               </div>
           </span>
       </div> 
</template>
<script>
export default {
  data() {
    return {};
  },

  mounted() {},
  methods: {
    tiaozou: function() {
      console.log(this.url);
      if (this.url != "") {
        this.$router.push({ name: this.url });
      }
    }
  },
  props: ["data", "url", "shiyong"],
  watch: {}
};
</script>
<style scoped lang="scss">
.youhui {
  display: flex;
  width: 710px;
  margin: 0 auto;
  margin-top: 20px;
  box-shadow: 0 0.026667rem 0.053333rem 0 rgba(40, 8, 92, 0.4);
  box-sizing: border-box;
  .img {
    width: 230px;
    height: 190px;
    position: relative;
    img {
      width: 230px;
      height: 190px;
    }
    div {
      font-family: SFUIText-Medium;
      font-size: 60px;
      color: #ffffff;
      position: absolute;
      right: 0;
      left: 0;
      bottom: 0;
      top: 0;
      margin: auto;
      width: 100%;
      height: 60px;
      text-align: center;
      font-weight: 800;
      span {
        font-size: 32px;
      }
    }
  }
  .box {
    background: #ffffff;
    width: 480px;
    height: 188px;
    position: relative;
    .neirong {
      position: absolute;
      right: 0;
      left: 0;
      bottom: 0;
      top: 0;
      margin: auto;
      height: 90px;
      margin-left: 30px;
      .neirongone {
        font-family: PingFangSC-Medium;
        font-size: 32px;
        color: #333333;
      }
      .neirongtwo {
        font-family: PingFangSC-Regular;
        font-size: 24px;
        color: #a5a5a5;
        margin-top: 20px;
      }
    }
    .img1 {
      width: 130px;
      height: 120px;
      & > img {
        width: 130px;
        height: 120px;
        position: absolute;
        right: 0;
        bottom: 70px;
        top: 0px;
        margin: auto;
      }
    }
  }
}
</style>